/* 灰色主题样式 */
:root {
  /* 主要颜色定义为灰色系 */
  --primary-color: #7a7a7a;
  --primary-light: #f5f5f5;
  --primary-dark: #444444;
  --secondary-color: #9e9e9e;
  --text-color: #333333;
  --text-secondary: #666666;
  --background-color: #f0f0f0;
  --border-color: #dddddd;
  --success-color: #888888;
  --warning-color: #aaaaaa;
  --danger-color: #555555;
}

/* 全局背景色 */
body {
  background-color: var(--background-color);
  color: var(--text-color);
}

/* Element Plus 组件的灰色主题 */
.el-menu {
  background-color: #e0e0e0 !important;
}

.el-menu-item,
.el-sub-menu__title {
  color: var(--text-color) !important;
}

.el-menu-item:hover,
.el-sub-menu__title:hover {
  background-color: #d0d0d0 !important;
}

.el-menu-item.is-active {
  background-color: #c0c0c0 !important;
  color: var(--text-color) !important;
}

/* 按钮样式调整为灰色系 */
.el-button--primary {
  background-color: var(--primary-color) !important;
  border-color: var(--primary-dark) !important;
}

.el-button--primary:hover {
  background-color: var(--primary-dark) !important;
  border-color: #555555 !important;
}

.el-button--success {
  background-color: #888888 !important;
  border-color: #666666 !important;
}

.el-button--warning {
  background-color: #aaaaaa !important;
  border-color: #888888 !important;
}

.el-button--danger {
  background-color: #555555 !important;
  border-color: #333333 !important;
}

/* 表格样式 */
.el-table {
  background-color: #fafafa !important;
  color: var(--text-color) !important;
}

.el-table th {
  background-color: #e0e0e0 !important;
  color: var(--text-color) !important;
}

.el-table tr {
  background-color: #fafafa !important;
}

.el-table .el-table__row:hover {
  background-color: #eeeeee !important;
}

/* 卡片样式 */
.el-card {
  background-color: #fafafa !important;
  border-color: var(--border-color) !important;
}

/* 输入框样式 */
.el-input__inner {
  background-color: #ffffff !important;
  border-color: var(--border-color) !important;
  color: var(--text-color) !important;
}

/* 分页组件 */
.el-pagination {
  color: var(--text-color) !important;
}

.el-pagination button,
.el-pagination span:not([class*=suffix]) {
  color: var(--text-color) !important;
}

/* 标签 */
.el-tag {
  background-color: #e0e0e0 !important;
  border-color: #c0c0c0 !important;
  color: var(--text-color) !important;
}

/* 对话框 */
.el-dialog {
  background-color: #fafafa !important;
}

.el-dialog__header {
  background-color: #e0e0e0 !important;
  border-bottom: 1px solid var(--border-color) !important;
}

.el-dialog__title {
  color: var(--text-color) !important;
}

/* 表单 */
.el-form-item__label {
  color: var(--text-color) !important;
}